<template>
    <div class="container">
        <div class="head">
            <img class="head-back-img" src="../assets/back.svg" alt="" @click="goBack">
            <div class="title">关于我们</div>
        </div>
        <div v-html="datas" class="datas"></div>
    </div>
</template>
<script>
import plantAPI from "@/api/plant";
export default {
    data() {
        return {
            datas: ''
        }
    },
    created() {
        plantAPI.configurationInfo({
            categoryName: '关于我们'
        }).then(res => {
            this.datas = res.data.configuration.replace(/<img/gi, '<img style="max-width:100%;height:auto;"');
        })
    },
    methods: {
        goBack() {
            this.$router.go(-1)
        }
    }
}
</script>
<style lang="scss" scoped>
.container {
    .head {
        width: 100%;
        height: 50px;
        display: flex;
        align-items: center;
        position: relative; // 关键：设置相对定位
        background-color: #ffffff;

        .head-back-img {
            width: 20px;
            height: 20px;
            position: absolute;
            left: 15px;
        }

        .title {
            width: 100%;
            text-align: center;
            font-size: 16px;
            color: #000000;
        }
    }

    .datas {
        width: 350px;
        font-size: 16px;
        margin: 10px auto;
    }
}
</style>